<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

</body>
<script>
    // 一、数组
    //（一）创建数组的方式
    // 1、字面常量方式
    // let a = ["hello", true, 1234];
    // console.log(a);
    // console.log(a.length);
    // console.log(typeof(a)); // object

    // 2、new方式
    // let c = new Array();
    // let b = new Array("hello", true, 1234);
    // console.log(b);
    // console.log(b.length);
    // console.log(typeof(b)); // object


    //（二）数组的增加
    // 1、length
    // let a = ["hello", true, 1234] // 数组有三个元素
    // a.length = 5;
    // console.log(a);
    // console.log(a[3], a[4]); // undefined undefined

    // 2、下标
    // let b = ["hello", true, 1234] // 数组有三个元素
    // b[4] = "world"
    // b[6] = "!"
    // console.log(b); // length等于7，没有赋值的元素是undefined

    // 3、push
    // let c = ["hello", true, 1234] // 数组有三个元素
    // c.push("world") // push每次都是在结尾增加元素
    // console.log(c);
    // c.length = 3; // length缩容没有效果

    //（三）删除元素
    // let a = new Array("hello", true, 1334, 34, "world'!'")
    // a.splice(1, 1) //从下标为1的位置删除1个元素
    // console.log(a)
</script>
<script>
    // 二、函数
    //（一）定义 && 调用
    // 1、第一种方式
    // function add(a, b)
    // {
    //     let c = a + b;
    //     return c
    // }
    // console.log(add(10, 11)) // 函数的定义和调用不分先后顺序
    // console.log(add(1, 2, 3, 4)) // 函数的实参和形参可以不匹配，实参多于形参个数，则多余的实参部分不适用
    // console.log(add(1)) // 实参少于形参个数，则多余的形参部分是undefined

    // 2、第二种方式（函数表达式：定义一个匿名函数，再将函数赋值给一个变量）
    // let sum = function() {
    //     let s = 0;
    //     for(let i = 0; i < arguments.length; i++)
    //         s += arguments[i];
    //     return s;
    // }
    // console.log(sum(1, 3))
    // console.log(sum(1, 2, 3, 4))
    // console.log(typeof sum) // function
</script>
<script>
    // 三、作用域
    //（一）局部作用域和全局作用域
    // 局部作用域：由{}限定的区域，在函数中或者其他循环语句中
    // 全局作用域：在js文件中，或者直接在script标签中，或者不用let/var定于变量，直接定义变量
    // 注意：ES6标准之前不是上述这样来区分作用域的，例如下面代码
    // if(1 < 2)
    // {
    //     let a = 10
    // }
    // console.log(a) // 10

    //（二）作用域链
    // 函数可以定义在函数内部
    // 内层函数可以访问外层函数的局部变量
    // 内部函数可以访问外部函数的变量，采取的是链式查找的方式，从内到外依次进行查找
</script>
<script>
    // 四、对象
    //（一）创建 && 使用
    // 1、字面量创建
    // let a = {} //空对象
    // let student = {
    //     name: '小红',
    //     weight: 140,
    //     height: 180,
    //     say: function() {
    //         console.log(this.name + "say:" + this.weight + "," + this.height) //注意函数中使用成员属性要加this
    //     }
    // } // 属性+行为
    // console.log(student.name) // '.'来调用
    // console.log(student['weight']) // 类似于键值对方式
    // student.say() // 调用方法
    // student.name = 'nihao' // 修改成员属性值
    // console.log(student)
    // console.log(typeof student) // object

    // 2、new Object创建
    // let student = new Object(); //和数组创建类型
    // student.name = '小红'
    // student.weight = 140
    // student['height'] = 180
    // student.say = function() {
    //     console.log(this.name + "say:" + this.weight + "," + this.height)
    // }
    // student['eat'] = function() {
    //     console.log("我在eat")
    // }
    // console.log(student)
    // // 注意：使用new Object创建对象，也可以随时使用student.属性 = value的方式来增加属性

    // 3、构造函数
    // 上述两种方式都是每次创建一个对象，不适合批量创建对象
    // People是构造函数名
    // function People(name, weight, height){
    //     this.name = name
    //     this.height = height
    //     this.weight = weight
    //     this.say = function(){
    //         console.log("hello world")
    //     }
    // }
    // let s1 = new People("小红", 130, 189) // 创建对象方式类似c++中new定义对象，但是此处的People是构造函数名
    // console.log(s1)
    // s1.say()
</script>
<script>
    // 五、class（ES6之后引入）
    // class People
    // {
    //     constructor(name, weight, height)
    //     {
    //         this.name = name
    //         this.height = height
    //         this.weight = weight
    //     }
    //     say() {
    //         console.log("hello world")
    //     }
    // }
    // let p = new People("小明", 140, 190)
    // console.log(p)
    // p.say()

    // 六、继承（ES6之前通过原型的方式实现继承）
    // class Student extends People
    // {
    //     constructor(name, weight, height, number)
    //     {
    //         super(name, weight, height)
    //         this.number = number
    //     }
    //     say() {
    //         console.log("小明 hello world")
    //     } // 子类重实现父类的方法
    // }
    // let s = new Student("小刚", 170, 190, 20251101)
    // console.log(s)
    // s.say()

    // 七、static关键字
    // 静态成员不属于对象，调用时候要通过类名来访问
    class People
    {
        constructor(name, weight, height)
        {
            this.name = name
            this.height = height
            this.weight = weight
        }
        static type = "human" // 静态成员属性
        static eat() {
            console.log("eat")
        } // 静态成员方法
        say() {
            console.log("hello world")
        }
    }
    let p = new People("小明", 140, 190)
    console.log(p)
    // console.log(p.type) // 错误
    console.log(People.type)
    // p.eat() // 错误
    People.eat()
</script>
</html>